<!DOCTYPE html>
<html lang="en"   xmlns:th="http://www.thymeleaf.org">
<head th:fragment="head(title)">
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title th:replace="${title}">博客详情</title>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/semantic-ui/2.2.4/semantic.min.css">
  <link rel="stylesheet" href="../../static/lib/editormd/css/editormd.min.css" th:href="@{/lib/editormd/css/editormd.min.css}">
  <link rel="stylesheet" href="../../static/css/lk.css" th:href="@{/css/lk.css}">
</head>
<body>
<!--导航-->
<nav th:fragment="menu(n)" class="ui inverted attached segment lk-padded-tb-mini">
  <div class="ui container">
    <!--        stackable可堆叠的-->
    <div class="ui inverted stackable secondary menu">
      <h2 class="ui teal header item">管理后台</h2>
      <a href="#" th:href="@{/admin/blogs}"  class="item lk-item lk-mobile-hide"th:classappend="${n==1} ? 'active'"><i class=" home icon"></i> 博客</a>
      <a href="#" th:href="@{/admin/types}" class="item lk-item lk-mobile-hide"th:classappend="${n==2} ? 'active'"><i class=" idea icon"></i> 分类</a>
      <a href="#" th:href="@{/admin/tags}" class="item lk-item lk-mobile-hide"th:classappend="${n==3} ? 'active'"><i class=" tag icon"></i>标签</a>
      <div class="right item lk-item lk-mobile-hide menu">
        <div class="ui dropdown item">
          <div class="text">
            <img src="https://picsum.photos/id/1004/100/100" alt="" class="ui avatar image">张三丰
            <i class="dropdown icon"></i>
          </div>
          <div class="menu">
            <a href="#" th:href="@{/admin/logout}" class="item">注销</a>
          </div>
        </div>
      </div>
    </div>
  </div>
  <!--    导航小图标-->
  <a href="#" class="ui black icon button lk-right-top lk-mobile-show menu toggle">
    <i class="sidebar icon"></i>
  </a>
</nav>
<br>
<br>
<br>

<!--底部-->
<footer th:fragment="footer" class="ui stackable inverted vertical segment ">
  <div class="ui stackable center aligned container lk-padded-tb">
    <div class="ui  stackable inverted divided grid">
      <div class="three wide column">
        <img src="../../static/images/这是一个网上的二维码.jpg" th:src="@{/images/这是一个网上的二维码.jpg}" alt="二维码图片" style="width: 10em;height: 10em">
      </div>
      <div class="three wide column">
        <h4 class="ui inverted header">最新博客</h4>
        <div class="ui inverted link list">
          <a href="#" class="item">用户故事</a>
          <a href="#" class="item">用户故事</a>
          <a href="#" class="item">用户故事</a>
        </div>
      </div>
      <div class="three wide column">
        <h4 class="ui inverted header">最新博客</h4>
        <div class="ui inverted link list">
          <a href="#" class="item">用户故事</a>
          <a href="#" class="item">用户故事</a>
          <a href="#" class="item">用户故事</a>
        </div>
      </div>
      <div class="seven wide column">
        <h4 class="ui inverted header">最新博客</h4>
        <p>这是我的个人博客</p>
      </div>
    </div>
    <div class="ui inverted section divider">    </div>
    <p class="lk-text-thin lk-text-space lk-opacity-tiny" style="align-content: center"> Copyright © 2020 - 2021 LKBS Designed by LKBS</p>
  </div>
</footer>
<th:block th:fragment="script">
  <script src="https://cdn.jsdelivr.net/npm/jquery@3.2.1/dist/jquery.min.js"></script>
  <script src="https://cdn.jsdelivr.net/semantic-ui/2.2.4/semantic.min.js"></script>
  <script src="//cdn.jsdelivr.net/npm/jquery.scrollto@2.1.2/jquery.scrollTo.min.js"></script>
  <script src="../../static/lib/editormd/editormd.min.js" th:src="@{/lib/editormd/editormd.min.js}"></script>
  <script src="../static/lib/prism/prism.js" th:src="@{/lib/prism/prism.js}"></script>
  <script src="../static/lib/tocbot/tocbot.min.js" th:src="@{/lib/tocbot/tocbot.min.js}"></script>
  <script src="../static/lib/qrcode/qrcode.min.js" th:src="@{/lib/qrcode/qrcode.min.js}"></script>
  <script src="../static/lib/waypoints/jquery.waypoints.min.js" th:src="@{/lib/waypoints/jquery.waypoints.min.js}"></script>
  <script>
    $('#newblog-container').load(/*[[@{/footer/newblog}]]*/"/footer/newblog");
  </script>
</th:block>

</body>
</html>